<template>
  <div class="list-loading">
    <Spinner
      type="fading-circle"
      v-show="!allLoaded"></Spinner>
    <span>{{ allLoaded ? '没有更多内容了~' : '加载中...' }}</span>
  </div>
</template>

<script>
  import { Spinner } from 'mint-ui'

  export default {
    props: {
      allLoaded: {
        type: Boolean,
        default: false
      }
    },
    components: {
      Spinner
    }
  }
</script>

<style lang='scss'>
  @import '../../common/scss/index.scss';

  .list-loading {
    font-size: 30px;
    height: 80px;
    margin: 30px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    span {
      font-size: 24px;
      color: $base-999;
      margin-left: 20px;
    }
  }
</style>
